<!DOCTYPE HTML>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用户留言 - ${site.name} - Powered by JEECMS</title>
<meta http-equiv="keywords" content="用户留言"/>
<meta http-equiv="description" content="用户留言"/>

<!--[if lt IE 9]>
<script src="${resSys}/html5.js" type="text/javascript"></script>
<![endif]-->
<link href="/${res}/css/html5.css" rel="stylesheet" type="text/css"/>

<link href="${resSys}/jqueryUI/jquery.ui.css" rel="stylesheet" type="text/css"/>
<script src="${resSys}/jquery.js" type="text/javascript"></script>
<script src="${resSys}/jqueryUI/jquery-ui.js" type="text/javascript"></script>
<script src="${resSys}/front.js" type="text/javascript"></script>
<style type="text/css">
/*留言板页样式*/
.relpy{margin-top:10px;color:#006600; width:555px; padding-right:10px;}
</style>
</head>
<body>
<div class="container">
	[#include "../include/header.html"/]
    [#include "../include/search_csi.html"/]
    [#include "../include/navi.html"/]
    <div class="w670">
        <div class="hundred100 mt10">
        	<div class="AreaTitle">留言列表</div>
        	<div class="lybCon">
                [@cms_guestbook_page siteId=site.id count='5' checked='1']
                [#list tag_pagination.list as m]
                <dl>
                    <div class="lybTX">
                        [#if m.member?? && m.member.userImg??]
                        [#if m.member.userImg!=""]
                        <img src="${m.member.userImg!}"  height="50" width="50"/>
                        [#else]
                        <img src="/${res}/img/member/member-phtot.gif" height="50" width="50"/>
                        [/#if]
                        [#else]
                        <img src="/${res}/img/member/member-phtot.gif" height="50" width="50"/>
                        [/#if]
                    </div>
        
                    <div class="lybMessage">
                        <h1>[${m.ctg.name!}]&nbsp;${m.contentHtml!}</h1>
                        <span style="color:#E66100; font-size:12px;">${(m.member.username)!'匿名网友'} 于${m.createTime}{评论}：</span>
                        <span style="color:#959595; font-size:12px; line-height:20px;">[@text_cut s=m.contentHtml len=60/]</span>
                        <div class="clear"></div>
                        <img src="../../${res}/img/guestbook/icon_message.gif" class="lybImg">
                        <h4>&nbsp;管理员回复：[@text_cut s=m.replyHtml len=30/]</h4>
                    </div>
                </dl>
                <div class="clear"></div>
                <div style="border-bottom:1px dashed #d6d6d6;"></div>
                [/#list]		   
                <div class="pagesite">[@cms_pagination sysPage='1'/]</div>
                [/@cms_guestbook_page]
            </div>
        </div>
    	<div class="clear-10"></div>
        <div class="hundred100">
        	<div class="AreaTitle">发表留言</div>
            <div class="lybCon">
            <form id="guestbookForm" action="${base}/guestbook.jspx" method="post">
            <table width="100%" border="0" cellpadding="0" cellspacing="0" style="margin-top:10px;">
            <tr>
            <td width="15%" height="35" align="right" bgcolor="#fafafa">类别：</td>
            <td bgcolor="#FFFFFF">
            <select name="ctgId" class="contactTex1">
            [@cms_guestbook_ctg_list siteId=site.id]
            [#list tag_list as ctg]
            <option value="${ctg.id}">${ctg.name}</option>
            [/#list]
            [/@cms_guestbook_ctg_list]
            </select>	          </td>
            <td width="15%" align="right" bgcolor="#FAFAFA">电子邮箱：</td>
            <td bgcolor="#FFFFFF">
            <input type="text" name="email" class="contactTex1" maxlength="100"/>
            </td>
            </tr>
            <tr>
            <td width="15%" height="35" align="right" bgcolor="#fafafa">电话：</td>
            <td bgcolor="#FFFFFF">
            <input type="text" name="phone" class="contactTex1" maxlength="50"/></td>
            <td width="15%" align="right" bgcolor="#FAFAFA">QQ：</td>
            <td bgcolor="#FFFFFF">
            <input type="text" name="qq" class="contactTex1"/></td>
            </tr>
            <tr>
            <td width="15%" height="35" align="right" bgcolor="#fafafa">标题：</td>
            <td colspan="3" bgcolor="#FFFFFF">
            <input name="title" type="text" size="40" class="contactTex1" maxlength="255"/></td>
            </tr>
            <tr>
            <td width="15%" align="right" valign="middle" bgcolor="#fafafa">
            留言内容：
            </td>
            <td colspan="3" bgcolor="#FFFFFF">
            <textarea name="content" class="cinput" cols="55" rows="4"></textarea></td>
            </tr>
            <tr>
            <td width="15%" align="right" bgcolor="#fafafa">验证码：</td>
            <td colspan="3" bgcolor="#FFFFFF">
            <div style="float:left; margin-top:10px;">
            <input type="text" name="captcha" class="plcode" maxlength="20" vld="{required:true}"/> 
            </div>
            <div style="float:left;">
            <img id="guestbookCaptcha" src="${base}/captcha.svl" onclick="this.src='${base}/captcha.svl?d='+new Date()"/>
            </div>
            </td>
            </tr>
            <tr>
            <td colspan="4" align="center" bgcolor="#FFFFFF">
            <div class="clear-10"></div>
            <input type="image" id="submit"  name="submit" value="留言"  src="/${res}/img/guestbook/gb-button.gif"/>
            </td>
            </tr>
            </table>
            </form>                                           
            <script type="text/javascript">
            $(function() {
	        	$("#submit").click(function () {
	                var options = {
	                    url: 'guestbook.jspx',
	                    type: 'post',
	                    dataType: 'json',
	                    data: $("#guestbookForm").serialize(),
	                    success:  function (data) {
		                	if(data.status==0) {
			                    alert("留言成功");
			                    location.href=location.href;
			                } else if(data.status==1) {	
			                    alert("验证码错误");
			                    $("#guestbookCaptcha").click();
			                }
	                    }
	                };
	                $.ajax(options);
	                return false;
	            });
            });
            
            </script> 
            </div>
        </div>
	</div>
    
    [#include "../include/right4.html"/]
    [#include "../include/friend_link.html"/]
	[#include "../include/footer.html"/]
</div>
</body>
</html>